<template>
  <div class="document-viewer">
    <iframe :src="documentUrl" frameborder="0" class="document-frame"></iframe>
  </div>
</template>

<script setup>
import { defineProps } from 'vue';

const props = defineProps({
  documentUrl: {
    type: String,
    required: true,
  },
});
</script>

<style scoped>
.document-viewer {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.document-frame {
  width: 100%;
  height: 80vh;
  border: none;
}
</style>